<!doctype html>
<html>

<head>
	<meta charset="utf-8">
	<title>热推藏品列表</title>
	<% include  ./template/commonCss.ejs %>
	<link href="<%=resUrl%>/css/recommend_product.css" rel="stylesheet" type="text/css" />
	<% include ./template/commonJs.ejs %>
	<% include ./template/chatLister.ejs %>
</head>

<body ontouchstart>
	<% var topTitle = '推荐藏品列表' ;var topReturnType = ''%>
	<% include ./template/topReturn.ejs %>
	<div class="weui-tab">
		<div class="weui-tab__bd" id="content">
			<div class="weui-flex">
				<div class="weui-flex__item">
					<div class="placeholder">
						<text>即将截拍</text><i class="iconfont icon-tri-down-mini"></i>
					</div>
					<div class="children">
						<div class="item current" orderType="1">
							<text>即将截拍</text><i class="iconfont icon-dagoux"></i>
						</div>
						<div class="item" orderType="2">
							<text>最新上传</text><i class="iconfont icon-dagoux"></i>
						</div>
						<div class="item" orderType="3">
							<text>热度排序</text><i class="iconfont icon-dagoux"></i>
						</div>
					</div>
				</div>
				<div class="weui-flex__item" orderType="4">
					<div class="placeholder"><text>信用排序</text></div>
				</div>
				<div class="weui-flex__item" orderType="5">
					<div class="placeholder"><text>消保</text></div>
				</div>
				<div class="weui-flex__item last" id="screen">
					<div class="placeholder">
						<text>筛选</text><i class="iconfont icon-shaixuan"></i>
					</div>
				</div>
			</div>
			
			<div id="weipai" class="weui-tab__bd-item weui-tab__bd-item--active">
				<!--下拉刷新-->
				<div class="weui-pull-to-refresh__layer" style="padding: 5px;">
					<div class="weui-pull-to-refresh__arrow"></div>
					<div class="weui-pull-to-refresh__preloader"></div>
					<div class="down">下拉刷新</div>
					<div class="up">释放刷新</div>
					<div class="refresh">正在刷新</div>
				</div>
				<div class="weipai-list" id="weipai-list-content">
					<div class="left-list" id="left-list-content"></div>
					<div class="right-list" id="right-list-content"></div>
					<div class="auto-height"></div>
				</div>
				<script id="left-list" type="text/html">
					{{each list}}
						{{if $value.type==1}}
							<a class="lot"  href="javascript:visitUrl('/auctionCollectDetail?id={{$value.id}}',true)">
						{{/if}}
						{{if $value.type==2}}
							<a class="lot"  href="javascript:visitUrl('/collectDetail?id={{$value.id}}',true)">
						{{/if}}
							<div class="info">
								<div class="pic"><img src="{{$value.coverImage}}?x-oss-process=image/resize,w_500"></div>
								<div class="row-header">
									{{if $value.userDetail}}
										<img src="{{$value.shopDetail.image}}?x-oss-process=image/resize,w_50,h_50">
										<div class="name">{{$value.shopDetail.name}}</div>
									{{/if}}
									<div class="view"><i class="num">{{$value.viewCount}}&nbsp;</i><i class="iconfont icon-liulan"></i></div>
								</div>
								<div class="title">{{if $value.type==1}}<i class="iconfont icon-paimai" style="font-size:0.4rem;color:#0F9BD6;margin-left:0;margin-right:0.1rem;"></i>{{/if}}{{$value.name}}</div>
								<div class="price">
									<text>¥{{$value.nowPrice}}</text>
									<div class="time">
										<i class="iconfont icon-naozhong" style="font-size:0.2rem"></i><time sign="unmake" time="{{$value.factEndDate | CountdownTime}}"></time>
									</div>
								</div>
							</div>
						</a>
					{{/each}}
				</script>	
				<script id="right-list" type="text/html">
					{{each list}}
						<a class="lot" href="javascript:visitUrl('/auctionCollectDetail?id={{$value.id}}',true)">
							<div class="info">
								<div class="pic"><img src="{{$value.coverImage}}?x-oss-process=image/resize,w_500"></div>
								<div class="row-header">
									{{if $value.userDetail}}
										<img src="{{$value.shopDetail.image}}?x-oss-process=image/resize,w_50,h_50">
										<div class="name">{{$value.shopDetail.name}}</div>
									{{/if}}
									<div class="view"><i class="num">{{$value.viewCount}}&nbsp;</i><i class="iconfont icon-liulan"></i></div>
								</div>
								<div class="title">{{$value.name}}</div>
								<div class="price">
									<text>¥{{$value.nowPrice}}</text>
									<div class="time">
										<i class="iconfont icon-naozhong" style="font-size:0.2rem"></i><time sign="unmake" time="{{$value.factEndDate | CountdownTime}}"></time>
									</div>
								</div>
							</div>
						</a>
					{{/each}}
				</script>
				<div class="weui-loadmore" id="loadmore">
					<i class="weui-loading"></i>
					<span class="weui-loadmore__tips">正在加载</span>
				</div>
				<div class="weui-loadmore weui-loadmore_line" style="display:none;" id="nomore">
					<span class="weui-loadmore__tips">到底了</span>
				</div>
			</div>
		</div>
	</div>
	<div class="mask"></div>
	<div class="screen_condition" id="screen_condition">
		<div class="content">
			<div class="item">
				<div class="title">搜索关键字</div>
				<div class="list"><input type="text" name="keyword"/></div>
			</div>
			<div class="item">
				<div class="title">选择一级分类</div>
				<div class="list" id="cate-list-content">
				</div>
				<script id="cate-list" type="text/html">
					<div class="unit" value="">全部</div>
					{{each list}}
						<div class="unit" value="{{$value.id}}">{{$value.label}}</div>
					{{/each}}
					<div class="auto-height"></div>
				</script>	
				<script>
					var cate1 = '';
					var cate2 = '';
					var attrs = [];
					$.post('/antique/api/sysDict/query_list',{
						token:getCookie('token'),
						type:'firstcategory',
						parentId:'0'
					},function(result){
						var html = template('cate-list', result.data);
						document.getElementById('cate-list-content').innerHTML = html;
						function bindAllUnit(){
							$('.screen_condition .item .list .unit').bind('click',function(){
								bindCurrentUnit(this);
								var parentId = $(this).attr('value');
								cate1 = parentId;
								if (parentId && parentId != ''){
									$.post('/antique/api/sysDict/query_lower_list',{
										parentId:parentId
									},function(cate2Result){
										if (cate2Result.data.list && cate2Result.data.list.length > 0){
											var html = template('twoCate-list',cate2Result.data);
											document.getElementById('twoCate-list-content').innerHTML = html;
											$('#twoCate').show();
											$('#twoCate-list-content .unit').click(function(){
												$('#twoCate-list-content .unit').removeClass('current');
												$(this).addClass('current');
												var cate2Id = $(this).attr('value');
												cate2 = cate2Id;
												$.post('/antique/api/sysDict/query_lower_list',{
													parentId:cate2Id
												},function(attrResult){
													var html = template('attrs-list', attrResult.data);
													document.getElementById('attrs').innerHTML = html;
													$('#attrs .item .list .unit').click(function(){
														$(this).parent().find('.unit').removeClass('current');
														$(this).addClass('current');
														attrs = [];
														$('#attrs .item .list .unit').each(function(){
															if ($(this).hasClass('current')){
																attrs.push($(this).attr('value'));
															}
														});
														console.log(cate1,cate2,attrs);
													});
												});
											});
										} else {
											$('#twoCate').hide();
										}
									});
								} else {
									$('#twoCate').hide();
									$('#attrs').empty();
								}
							});
						}
						function bindCurrentUnit(_this){
							$('.screen_condition .item .list .unit').removeClass('current').unbind('click').hide();
							$(_this).addClass('current').show().click(function(){
								$('.screen_condition .item .list .unit').show();
								$(_this).removeClass('current');
								bindAllUnit();
								$('#twoCate').hide();
								$('#attrs').empty();
								resetCate();
							});
						}
						bindAllUnit();						
						$('#screen_condition_reset').click(function(){
							$('.screen_condition .item .list input').val('');
							$('.screen_condition .item .list .unit').removeClass('current');
						});
					});
				
					function resetCate(){
						cate1 = '';
						cate2 = '';
						attrs = [];
					}
				</script>
			</div>
			<div class="item" id="twoCate" style="display:none;">
				<div class="title">选择二级分类</div>
				<div class="list" id="twoCate-list-content">
				</div>
				<script id="twoCate-list" type="text/html">
					<div class="unit" value="">全部</div>
					{{each list}}
						<div class="unit" value="{{$value.id}}">{{$value.label}}</div>
					{{/each}}
					<div class="auto-height"></div>
				</script>
			</div>
			<div id="attrs">
				
			</div>
			<script id="attrs-list" type="text/html">
				{{each list as attr i}}
					<div class="item">
						<div class="title">{{attr.label}}</div>
						<div class="list">
							<div class="unit" value="">全部</div>
							{{each attr.child as option}}
								<div class="unit" value="{{option.id}}">{{option.label}}</div>
							{{/each}}
							<div class="auto-height"></div>
						</div>
					</div>
				{{/each}}
			</script>
		</div>
		<div class="op">
			<button class="l" id="screen_condition_reset">重置</button>
			<button class="r" id="screen_condition_confirm">确认</button>
		</div>
	</div>
	<script type="text/javascript" src="<%=resUrl%>/js/recommend_product.js"></script>
</body>

</html>